正文:
上一篇介紹完了時間選取/選擇器,這次就來介紹日期選取器吧
<el-date-picker v-model="date" placeholder="選擇日期"></el-date-picker>
與時間選取器相同,v-model內為 date 型別,我們可以透過 type 屬性設置更多種類的日期選取器,譬如選取週、月、年或是多個日期
<el-date-picker v-model="week" type="week" placeholder="選擇週"></el-date-picker>
<el-date-picker v-model="month" type="month" placeholder="選擇月"></el-date-picker>
<el-date-picker v-model="week" type="year" placeholder="選擇年"></el-date-picker>
<el-date-picker v-model="dates" type="dates" placeholder="選擇多個日期"></el-date-picker>
我們可以透過 format
設定要在輸入框顯示的樣式,透過 value-format
設定綁定值的格式,這邊格式上需要特別注意大小寫
yyyy 年
M 月(不補零)
MM 月
W 周(僅限周選取器才可以使用,不補零)
WW 周(僅限周選取器才可以使用)
d 日(不補零)
dd 日
H 小時(24小時制,不補零)
HH 小時(24小時制)
h 小時(12小時制,須配合 A/a 來使用,不補零)
hh 小時(12小時制,須配合 A/a 來使用)
A AM/PM(僅限 format 使用)
a am/pm(僅限 format 使用)
m 分鐘(不補零)
mm 分鐘
timestamp 時間戳(僅限 value-format 可以使用)